require("./AdminCourseEdit.scss")

require("../../both/base.js")
import {Link} from "react-router"

const  PropTypes = React.PropTypes

function getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);  //获取url中"?"符后的字符串并正则匹配
    var context = "";
    if (r != null)
        context = r[2];
    reg = null;
    r = null;
    return context == null || context == "" || context == "undefined" ? "" : context;
}

class AdminCourseEdit extends React.Component {
    constructor(props){
        super(props)
        this.tabIdx = 0

        const {init} = this.props
        var courseId = this.courseId = getQueryString("courseId")
        init(parseInt(courseId))
    }

    changeTab(e){
        var li = e.target.parentNode
        var lists = li.parentNode.childNodes
        this.tabIdx = Array.prototype.indexOf.call(lists,li)
    }

    render(){
        var self = this
        const changeTab = self.changeTab.bind(this)
        const {course,setCourse,init,delCourse} = self.props

        var childrenWithProps = React.cloneElement(self.props.children,
            Object.assign({},self.props,{
                courseId : self.courseId
            })
        )

        return (
            <div className="admin_course_edit_cr bln">
                <div className="header_cr">
                    <a href="/admin_home/course"><div className="return">
                        <i className="fa fa-angle-left"></i>
                        <span className="hd">课程列表</span>
                    </div></a>
                    <div className="seg"><span>|</span></div>
                    <div className="header_title">
                        <span>{course.title}</span>
                    </div>
                </div>
                <div className="tab_lists">
                    <ul onClick={changeTab} id="course_edit_tabs">
                        <li><Link to="/admin/course_edit/info" className={this.tabIdx == 0 && "cur"}>课程信息管理</Link></li>
                        <li><Link to="/admin/course_edit/video" className={this.tabIdx == 1 && "cur"}>视频管理</Link></li>
                        <li><Link to="/admin/course_edit/files" className={this.tabIdx == 2 && "cur"}>附件管理</Link></li>
                        <li><Link to="/admin/course_edit/comments" className={this.tabIdx == 3 && "cur"}>评论管理</Link></li>
                        <li><Link to="/admin/course_edit/notes" className={this.tabIdx == 4 && "cur"}>笔记管理</Link></li>
                    </ul>
                </div>
                <div className="course_edit_content">
                    {childrenWithProps}
                </div>
            </div>
        )
    }
}

AdminCourseEdit.propTypes = {
    init : PropTypes.func.isRequired,
    setCourse : PropTypes.func.isRequired,

    course : PropTypes.object
}

export default AdminCourseEdit